<template>
  <div>
    <div class="box_item" @click="callPhone">{{ $t('三方应用呼叫') }}</div>
    <div class="box_item" @click="sendMessage" v-show="$permiss[592] && modeKey === 'myPhone'">{{ $t('发送系统短信') }}</div>
    <div class="box_item" @click="openZalo" v-show="!isMoxige">{{ $t('打开zalo') }}</div>
    <div class="box_item" @click="openWhatsApp" v-show="isMoxige">{{ $t('打开whatsAPP') }}</div>
  </div>
</template>

<script>
import {addCollectionCallPhoneRecord, addRemindPhoneRecord} from '@/api/postLoan'
import {addMarketPhoneRecord} from '@/api/marketing'

export default {
  name: "SelectCallPhone",
  props: {
    phone: {},
    // 1 提醒，2催收，3信审，4营销
    modeType: {},
    // 埋点key值
    modeKey: {},
    orderId: {
      default: null,
    },
    //0转换1数据2共享3复借4流量
    marketingType: {},
    marketingRows: {}
  },
  computed: {
    isMoxige() {
      return process.env.VUE_APP_REGION === 'moxige'
    }
  },
  data() {
    return {
      key: '',
      // 0拨打电话 1zalo/whatsAPP
      phoneType: null,
    }
  },
  methods: {
    // 拨打电话
    async callPhone() {
      switch (this.modeKey) {
        case  'myPhone':
          this.key = 'myPhoneNum';
          break;
        case  'addressBook':
          this.key = 'addressBookNum';
          break;
        case  'contact':
          this.key = 'contactNum';
          break;
        case  'local50':
          this.key = 'local50Num';
          break;
        case  'operator50':
          this.key = 'operator50Num';
          break;
        case  'operator':
          this.key = 'operatorNum';
          break;
        case  'phoneAddressBook':
          this.key = 'phoneAddressBookNum';
          break;
      }
      this.phoneType = 0
      await this.addRecord()
      const a = document.createElement('a')
      a.href = 'sip:' + this.phone + ',' + new Date().getTime()
      a.click()
    },
    // 发送短信
    async sendMessage() {
      switch (this.modeKey) {
        case  'myPhone':
          this.key = 'myMessageNum';
          break;
      }
      await this.addRecord()
      // 调用父组件方法
      this.$emit('sendMessage', this.orderId)
    },
    // 打开WhatsApp
    async openWhatsApp() {
      switch (this.modeKey) {
        case  'myPhone':
          this.key = 'myZaloNum';
          break;
        case  'addressBook':
          this.key = 'addressBookZaloNum';
          break;
        case  'contact':
          this.key = 'contactZaloNum';
          break;
        case  'local50':
          this.key = 'localOperator50Num';
          break;
        case  'operator50':
          this.key = 'operator50ZaloNum';
          break;
        case  'operator':
          this.key = 'operatorZaloNum';
          break;
        case  'phoneAddressBook':
          this.key = 'phoneAddressBookZaloNum';
      }
      this.phoneType = 1
      await this.addRecord()
      const href = `https://web.whatsapp.com/send?phone=+52${this.phone}`
      window.open(href)
    },
    // 打开zalo
    async openZalo() {
      switch (this.modeKey) {
        case  'myPhone':
          this.key = 'myZaloNum';
          break;
        case  'addressBook':
          this.key = 'addressBookZaloNum';
          break;
        case  'contact':
          this.key = 'contactZaloNum';
          break;
        case  'local50':
          this.key = 'localOperator50Num';
          break;
        case  'operator50':
          this.key = 'operator50ZaloNum';
          break;
        case  'operator':
          this.key = 'operatorZaloNum';
          break;
        case  'phoneAddressBook':
          this.key = 'phoneAddressBookZaloNum';
      }
      this.phoneType = 1
      await this.addRecord()
      let phoneStr = this.phone
      phoneStr = this.phone.slice(-9)
      const href = `https://zalo.me/+84${phoneStr}`
      window.open(href)
    },
    async addRecord() {
      if (this.modeType === '1') {
        await this.addRemindCallRecord()
      } else if (this.modeType === '2') {
        await this.addCollectionCallRecord()
      } else if (this.modeType === '4') {
        await this.addMarketPhoneRecord()
      }
    },
    /**
     *  添加记录 催收电话埋点记录
     */
    async addCollectionCallRecord() {
      const params = {
        loanRecordId: this.orderId,
        //客户端0后台,1安卓
        clientType: 0,
        phone: this.phone,
      }
      params[this.key] = 1
      await addCollectionCallPhoneRecord(params)
    },
    /**
     *  添加记录 提醒电话埋点记录
     */
    async addRemindCallRecord() {
      const params = {
        loanRecordId: this.orderId,
        //客户端0后台,1安卓
        clientType: 0,
        phone: this.phone,
      }
      params[this.key] = 1
      await addRemindPhoneRecord(params)
    },
    /**
     *
     *  添加记录 营销电话埋点记录
     */
    async addMarketPhoneRecord() {
      const params = {
        dataId: this.marketingRows.id,
        dataType: this.phoneType,
        marketingType: this.marketingType,
      }
      if (this.marketingType === 0) {
        params['distributionTime'] = this.marketingRows.createTime
      } else if (this.marketingType === 1) {
        params['distributionTime'] = this.marketingRows.allocationTime
        params['dataId'] = this.marketingRows.dataUserId
      } else if (this.marketingType === 2) {
        params['distributionTime'] = this.marketingRows.createTime
      } else if (this.marketingType === 3) {
        params['distributionTime'] = this.marketingRows.singleTime
      } else if (this.marketingType === 4) {
        params['distributionTime'] = this.marketingRows.createTime
      }
      await addMarketPhoneRecord(params)
    }
  }
}
</script>

<style scoped>
.box_item {
  text-align: center;
  padding: 7px;
  font-size: 12px;
  border-bottom: 1px solid #f4f4f4;
  cursor: pointer;
}

.box_item:hover {
  background-color: #f0f2f5;
  color: #F1B901;
}
</style>
